import { INCREMENT } from '../store/mutations-types'

export default {
  // 增加
  [INCREMENT](state, n) {
    if (n) { state.counter += n; }
    else { state.counter++; }
  },

  // 减少
  decrement(state) {
    state.counter--;
  },

  // addStudent(state, student) {
  // 第二种提交风格获取
  addStudent(state, payload) {
    // payload: 负载, 整一个对象, 包括type等...
    let f = state.students.some(s => s.id == payload.stu.id);
    if (!f) {
      state.students.push(payload.stu);
    } else {
      alert("此学生已经添加过了哦~");
    }
  },

  updateInfo(state, name) {
    state.info.name = name;

    // 往info对象中添加address属性 >>> 老版本做不到响应式
    // state.info['address'] = '洛杉矶';

    // 使用Vue.set()使之变成响应式的 >>> 无论是否新老版本都可以做到
    // Vue.set(state.info, 'address', '洛杉矶');

    // 删除对象中的属性 >>> 该方式在老版本中不能做到响应式
    // delete state.info.name

    // 使用Vue,delete() >>> 无论是否新老版本都可以做到响应式
    // Vue.delete(state.info, 'name');

    // 注!!! 如果是使用了异步操作呢？
    // setTimeout(() => {
    //   state.info.name = name;
    // }, 1000);
    // ps: 我们可以看到界面改变了, 但是Vuex状态管理中对象的值却没有改变, 这是因为Vuex并没有记录[跟踪]到改变, 所以Vuex官方文档中说明最好不要在mutation中使用异步操作, 那么如果真的需要用到异步操作的时候怎么办呢？Vuex给我提供了actions: {}
  }
}
